﻿@{
    Layout = "~/Views/Shared/v1_admin_layout.cshtml";
    var url_json = "";
    if (!string.IsNullOrWhiteSpace(Request.QueryString["ParentID"]))
    {
        url_json = Url.Action("jsonList", new { ParentID = Request.QueryString["ParentID"] });
    }
    else
    {
        url_json = Url.Action("jsonList");
    }
    var MenuItem = (Guline.SupportCMS.Models.Object.MenuItem)ViewBag.MenuItem;
}
<script src="~/Content/jqwidgets/jqx-all.js"></script>
<script src="~/Content/jqwidgets/globalization/globalize.js"></script>
<script src="~/Content/jqwidgets/globalization/globalize.culture.vi-VN.js"></script>
<link rel="stylesheet" href="/Content/jqwidgets/styles/jqx.base.css" type="text/css" />
<link rel="stylesheet" href="/Content/jqwidgets/styles/jqx.arctic.css" type="text/css" />


@if (!string.IsNullOrWhiteSpace(Request.QueryString["ParentID"]))
{
    if (MenuItem != null)
    {
        <span style="font-size:19px;font-weight:bold">@MenuItem.Name</span>
    
    <a href="@Url.Action("Index", new { ParentID = MenuItem.ParentID })" class="btn btn-small btn-success"><< Về cấp trước 
    </a>
    }
    else
    {
    <a href="@Url.Action("Index")" class="btn btn-small btn-success"><< Về cấp trước 
    </a>
    }
}
| 
<a href="@Url.Action("Create")" class="btn btn-small btn-success">
    <span class="icon-new icon-white"></span>
    Thêm mới
</a>
| 

<button class="btn btn-small Edit">
    <span class="icon-edit"></span>
    Sửa
</button>


<button class="btn btn-small toolbar-delete">
    <span class="icon-delete"></span>
    Xóa
</button>


<button class="btn btn-small">
    <span class="icon-unpublish"></span>
    Bỏ lọc dữ liệu
</button>


<button class="btn btn-small">
    <span class="icon-refresh"></span>
    Làm mới
</button>

<script type="text/javascript">
    $(document).ready(function () {
        var theme = "arctic";
        var url = "@url_json";
        var rowID = 0;

        var getAdapter = function () {
            var source = {
                datatype: "json",
                datafields: [

                 { name: 'Name' },
                 // m.ID, m.Name, m.Menu_URL, ParentName
                 { name: 'Menu_URL' },
                 { name: 'Enable', type: "boolean" },
                 { name: 'ParentName' },
                 { name: 'ID' }
                ],
                id: 'ID',
                url: url
            };


            var dataAdapter = new $.jqx.dataAdapter(source);
            return dataAdapter;
        }
        var imagerenderer = function (row, datafield, value) {
            var datarow = $("#grid_object").jqxGrid('getrowdata', row);
            console.log(datarow);
            return '<a href="@Url.Action("Index")/?ParentID=' + datarow.ID + '">' + value + '</a>';
        }
        var imagerenderer_company = function (row, datafield, value) {
            return '<img style="margin:10px;10px;10px;10px;height:50px;" height="50" width="150" src="@Request.Url.GetLeftPart(UriPartial.Authority)/' + value + '"/>';
        }
        var flagimage = function (row, datafield, value) {
            return '<img style="margin-left: 38px;margin-top: 23px;width: auto;" height="25" width="40" src="@Request.Url.GetLeftPart(UriPartial.Authority)/' + value + '"/>';
        }
        var getLocalization = getlocalizationobj();
        $("#grid_object").jqxGrid({
            width: '100%',
            source: getAdapter(),
            rowsheight: 100,
            theme: theme,
            autoheight: true,
            pageable: true,
            pagermode: 'simple',
            sortable: true,
            pagesize: 10,
            showfilterrow: true,
            enabletooltips: true,
            autoshowfiltericon: true,
            selectionmode: 'checkbox',
            filterable: true,
            localization: getLocalization,
            showtoolbar: false,
            altrows: true,
            columns: [

							 															{ text: 'Name', datafield: 'Name', width: 320, cellsrenderer: imagerenderer },

                                                                                       { text: 'ParentName', datafield: 'ParentName', width: 120 },
							 															{ text: 'Menu_URL', datafield: 'Menu_URL', width: 120 },
							 															{ text: 'Enable', datafield: 'Enable', columntype: "checkbox", width: 80, filtertype: "checklist" },

							                           { text: 'ID', datafield: 'ID', width: 30 }

            ]
        });


        $(".Edit").click(function () {
            var selectedrowindex = $("#grid_object").jqxGrid('getselectedrowindex');
            var rowscount = $("#grid_object").jqxGrid('getdatainformation').rowscount;
            var id = $("#grid_object").jqxGrid('getrowid', selectedrowindex);
            var dataRecord = $("#grid_object").jqxGrid('getrowdata', selectedrowindex);
            if (selectedrowindex >= 0) {
                location = "@Url.Action("Edit")/" + dataRecord.ID;
            }
            else {
                alert("Chọn dữ liệu cần sửa.");
            }
        });
        $("#toolbar-clearfilter").click(function () {
            $("#grid_object").jqxGrid('clearfilters');
        });
        $("#toolbar-refresh").click(function () {
            $("#grid_object").jqxGrid({
                source: getAdapter()
            });
            $("#grid_object").jqxGrid('clearselection');
        });
        $(".toolbar-delete").click(function () {
            var selectedrowindexes = $("#grid_object").jqxGrid('getselectedrowindexes');
            var rowscount = $("#grid_object").jqxGrid('getdatainformation').rowscount;
            if (selectedrowindexes.length != 0) {
                var comfim = confirm("Bạn có thật sự muốn xóa?");
                if (comfim) {
                    $("#grid_object").jqxGrid('beginupdate');
                    var resultid = 0;

                    for (var m = 0; m < selectedrowindexes.length; m++) {
                        var selectedrowindex = selectedrowindexes[selectedrowindexes.length - m - 1];
                        if (selectedrowindex >= 0 && selectedrowindex < rowscount) {
                            var id = $("#grid_object").jqxGrid('getrowid', selectedrowindex);
                            var dataRecord = $("#grid_object").jqxGrid('getrowdata', selectedrowindex);
                            $("#grid_object").jqxGrid('deleterow', id);
                            $.ajax({
                                type: "POST",
                                url: "@Url.Action("ajDelete")",
                                datatype: "Json",
                                data: { id: dataRecord.ID },
                                success: function (result) {

                                }
                            });
                        }
                    }

                }
            }
            else {
                alert("Chọn dữ liệu cần xóa");
            }
            $("#grid_object").jqxGrid('endupdate');
            $("#grid_object").jqxGrid('clearselection');
            return false;
        });

    });

</script>
<div id="grid_object" style="margin-left: 4px; margin-top: 10px; margin-bottom: 10px;"></div>
<a href="@Url.Action("Create")" class="btn btn-small btn-success">
    <span class="icon-new icon-white"></span>
    Thêm mới
</a>


<button class="btn btn-small Edit">
    <span class="icon-edit"></span>
    Sửa
</button>


<button class="btn btn-small toolbar-delete">
    <span class="icon-delete"></span>
    Xóa
</button>


<button class="btn btn-small">
    <span class="icon-unpublish"></span>
    Bỏ lọc dữ liệu
</button>


<button class="btn btn-small">
    <span class="icon-refresh"></span>
    Làm mới
</button>
